<template>
	<view>

		<view style="padding: 0rpx 30rpx;">
			<view style="font-size: 120%; font-weight: bold;">
				我的频道
			</view>
			<view style="margin-top: 30rpx;">
				<u-tag v-for="(object, index) in userChooseClassify" :key="index" style="margin-top: 20rpx; margin-right: 30rpx;"
				 mode="light" type="primary" :text="object.name" shape="circle" color="#00a0ff" :closeable="object.id == '首页' ? false : true"
				 :show="true" @close="tagCloseClick(index, object.id)">
				</u-tag>
			</view>
		</view>

		<view style="padding: 0rpx 30rpx; margin-top: 30rpx;">
			<view style="font-size: 120%; font-weight: bold;">
				更多频道
			</view>
			<view style="margin-top: 30rpx;">
				<u-tag v-for="(object, index) in courseTotalClassify" :key="index" style="margin-top: 20rpx; margin-right: 30rpx;"
				 mode="light" :type="object.show == '0' ? 'info' : 'primary'" :text="object.name" shape="circle" :color="object.show == '0' ?  '#909399' : '#00a0ff'"
				 :closeable="false" :show="true" @click="tagAddClick(index, object.id, object.show)">
				</u-tag>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				userChooseClassify: [],
				courseTotalClassify: []
			}
		},
		methods: {
			tagCloseClick(index, id) {
				let that = this;

				that.userChooseClassify.splice(index, 1)
				
				for(let i = 0; i < that.courseTotalClassify.length; i++)
				{
					if(that.courseTotalClassify[i].id == id)
					{
						that.courseTotalClassify[i].show = '1'
					}
				}
			},
			tagAddClick(index, id, show) {
				let that = this;
				
				if(show != '0')
				{
					for(let i = 0; i < that.courseTotalClassify.length; i++)
					{
						if(that.courseTotalClassify[i].id == id)
						{
							that.courseTotalClassify[i].show = '0'
						}
					}
					let obj = JSON.parse(JSON.stringify(that.courseTotalClassify[index]))
					obj.show = '1'
					that.userChooseClassify.push(obj)
				}
			}
		},
		onLoad() {
			// console.log(uni.getStorageSync('courseTotalClassify'))

			let that = this;
			let chooseArr = JSON.parse(JSON.stringify(uni.getStorageSync('userChooseClassify')))
			that.userChooseClassify = uni.getStorageSync('userChooseClassify');

			let arr = JSON.parse(JSON.stringify(uni.getStorageSync('courseTotalClassify')))
			for (let i = 0; i < arr.length; i++) {
				let id = arr[i].id;
				// console.log(i)
				for (let j = 0; j < chooseArr.length; j++) {
					// console.log(j)
					if (chooseArr[j].id == id) {
						arr[i].show = '0'
						break;
					}
				}
			}
			// console.log(arr)
			that.courseTotalClassify = JSON.parse(JSON.stringify(arr)); // ?????? 只能这么写
			// console.log(that.courseTotalClassify)
		},
		// H5端onBackPress只能监听页面导航栏的返回按钮的点击事件，不能监听浏览器返回以及手机的返回
		onBackPress(resp) {
			let that = this;

			uni.setStorage({
				key: "userChooseClassify",
				data: that.userChooseClassify
			});
		}
	}
</script>

<style>

</style>
